<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./css/base.css">
    <!-- 通用样式 -->
    <link rel="stylesheet" href="./css/common.css">
    <!-- mine.css -->
    <link rel="stylesheet" href="/css/mine.css">
    <!-- jq -->
    <!-- <link rel="stylesheet" type="text/css" href="./jq/css/htmleaf-demo.css" />
    <link rel="stylesheet" type="text/css" href="./jq/css/normalize.css"> -->
    <!--  -->
    <script src="./bootstrap-3.4.1-dist/js/jquery.min.js"></script>
    <link rel="stylesheet" href="./bootstrap-3.4.1-dist/css/bootstrap.min.css">
    <script src="./bootstrap-3.4.1-dist/js/bootstrap.min.js"></script>

    <SCript src="./js/index.js"></SCript>
</head>

<body style="background-color: rgb(240, 247, 248);">
    <!-- head -->

    <div class="header_1">
        <div class="fl">

            <div><img src="./img/logo3.png" alt=""></div>
            <div>
                <ul class="column">

                    <li>首页</li>
                    <li>yao配音</li>
                    <li>排行榜</li>
                    <li>附近</li>

                </ul>
            </div>

        </div>
        <div class="fr">
            <div class="search">
                <input type="text" class="text" value="请搜索内容...">
                <button class="btn glyphicon glyphicon-search"></button>
            </div>
            <div class="user">
                <ul>
                    <li>社区</li>
                    <li>消息</li>
                    <li>关注</li>
                    <li>
                        <a href="#" data-toggle="modal" data-target=".login" class="glyphicon glyphicon-user"></a>
                    </li>
                </ul>
                <!-- 登陆窗口 -->
                <div class="modal fade login" tabindex="1" role="dialog">
                    <div class="modal-dialog" role="document">
                        <div class="modal-content">
                            <div class="modal-header">
                                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                                <h4 class="modal-title">登录信息</h4>
                            </div>
                            <div class="modal-body">
                                <form>
                                    <div class="form-group">
                                        <label for="exampleInputEmail1">用户名</label>
                                        <input type="email" class="form-control" id="exampleInputEmail1">
                                        <!-- placeholder="Email" -->
                                    </div>
                                    <div class="form-group">
                                        <label for="exampleInputPassword1">密码</label>
                                        <input type="password" class="form-control" id="exampleInputPassword1">
                                    </div>

                                    <div class="checkbox">
                                        <label>
                                                    <input type="checkbox"> 记住用户名
                                                  </label>
                                    </div>

                                </form>
                            </div>
                            <div class="modal-footer">
                                <button type="button" class="btn btn-default" data-dismiss="modal">注册</button>
                                <button type="button" class="btn btn-primary">登录</button>
                            </div>
                        </div>
                        <!-- /.modal-content -->
                    </div>
                    <!-- /.modal-dialog -->
                </div>
                <!-- /.modal -->
                <!-- 窗口end -->
            </div>
        </div>

    </div>
    <!-- head end -->
    <div class="user_bg w">
        <div class="user_self">
            <div class="user_head">头像</div>
            <div class="user_message">
                <ul>
                    <li>知为己</li>
                    <li>知己只为知心人，知己从未知人心</li>
                </ul>
            </div>
        </div>
    </div>
    <div class="nav w">
        <div class="nav_column">
            <ul>
                <li><a href="#">主页</a></li>
                <li><a href="#">动态</a></li>
                <li><a href="#">投稿</a></li>
                <li><a href="#">收藏</a></li>
                <li><a href="#">订阅</a></li>
                <li><a href="#">设置</a></li>

            </ul>
        </div>
        <div class="search">
            <input type="text" class="text" value="搜索视频、动态">
            <button class="btn glyphicon glyphicon-search"></button>
        </div>
        <div class="my_data">
            <ul>
                <li>关注</li>
                <li>粉丝</li>
                <li>获赞</li>
                <li>播放</li>
                <li>阅读</li>
            </ul>
        </div>
    </div>
</body>

</html>